<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../commons/taglibs.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport"
	content="width=device-width,initial-scale=0.9,user-scalable=1" />

<base href="<%=basePath%>">

<title>积分记录详细</title>
<script type="text/javascript" src="javascript/jquery-1.11.0.js"></script>

<link rel="stylesheet" href="javascript/v2/css/bootstrap-select.css">
<link rel="stylesheet" href="javascript/v2/css/bootstrap-responsive.css">
<link rel="stylesheet" href="javascript/v2/css/bootstrap.css">

<script src="javascript/v2/js/bootstrap.js"></script>
<script src="javascript/v2/js/bootstrap-select.js"></script>

<script type="text/javascript">
	$(document)
			.ready(
					function() {
						var range = 50; //距下边界长度/单位px  
						var maxnum = $("#asyncCount").val(); //设置加载最多次数  
						var totalheight = 0;
						var asynCount = 1;
						$(window)
								.scroll(
										function() {
											var srollPos = $(window)
													.scrollTop(); //滚动条距顶部距离(页面超出窗口的高度)  

											//console.log("滚动条到顶部的垂直高度: "+$(document).scrollTop());  
											//console.log("页面的文档高度 ："+$(document).height());  
											//console.log("浏览器的高度："+$(window).height());  

											totalheight = parseFloat($(window)
													.height())
													+ parseFloat(srollPos);
											if (($(document).height() - range) <= totalheight
													&& asynCount < maxnum) {

												$
														.ajax({
															cache : true,
															async : false,
															type : "POST",
															url : "wumimember/logscoreaction!ajaxLogScoreDetail",
															data : $(
																	"#logScoreDetailForm")
																	.serialize(),
															dataType : "json",
															error : function(
																	request) {
																alert("Connection error");
															},
															success : function(
																	data) {
																var d = eval("("
																		+ data
																		+ ")");
																var nextIndex = parseInt(document
																		.getElementById("pageIndex").value) + 1;
																document
																		.getElementById("pageIndex").value = nextIndex;
																for ( var i = 0; i < d.length; i++) {
																	if (d[i].type == 0) {
																		$(
																				"#scoreList")
																				.append(
																						"<tr><td><font color='#FF5511'>-"
																								+ d[i].numer
																								+ "</font></td><td>"
																								+ d[i].createTime
																								+ "</td><td>"
																								+ d[i].bShop.name
																								+ "</td></tr>");
																	} else if (d[i].type == 1) {
																		$(
																				"#scoreList")
																				.append(
																						"<tr><td><font color='#00AA00'>+"
																								+ d[i].numer
																								+ "</font></td><td>"
																								+ d[i].createTime
																								+ "</td><td>"
																								+ d[i].bShop.name
																								+ "</td></tr>");
																	} else {
																		$(
																				"#scoreList")
																				.append(
																						"<tr><td>"
																								+ d[i].numer
																								+ "</td><td>"
																								+ d[i].createTime
																								+ "</td><td>"
																								+ d[i].bShop.name
																								+ "</td></tr>");
																	}
																}
																asynCount++;
															}
														});

											}
										});
					});
</script>

</head>
<body lang="zh-cn">
 	 <div class="wrapper">	
	<div class="container-fluid">
		<div class="row-fluid">
			<!--/span-->
			<div class="span12">
				<form id="logScoreDetailForm">
					<input type="hidden" name="pageIndex" id="pageIndex" value="2">
					<input type="hidden" name="member.id" value="${member.id }">
					<input type="hidden" name="member.logScoreType"
						value="${member.logScoreType }"> <input type="hidden"
						name="member.eaId" value="${member.eaId }">
				</form>
				<!-- 控制异步加载的次数 -->
				<input type="hidden" id="asyncCount" name="asyncCount"
					value="${asyncCount }">

				<div class="alert alert-success">当前积分：<fmt:formatNumber value="${logScore.scoreSum }" pattern="0" /></div>
				<div class="alert alert-info">积分排名：第${logScore.scoreRanking}名</div>
				<div class="alert alert-danger">等级：${member.level }</div>
				<div align="right">
					<a class="btn btn-primary"
						href="wumimember/announcementaction!watchAnnouncement?member.eaId=${member.eaId }">积分活动</a>
					<a class="btn btn-primary"
						href="wumimember/memberaction!returnMemberPage?member.eaId=${member.eaId }">返回主页</a>
				</div>

				<table class="table table-hover">
					<thead>
						<c:if test="${fn:length(logScoreList) != 0 }">
							<tr>
								<th>积分</th>
								<th>时间</th>
								<th>地点</th>
							</tr>
						</c:if>
					</thead>
					<tbody id="scoreList">
						<c:forEach items="${logScoreList}" var="logScore"
							varStatus="status">
							<tr>
								<!--  
								<td style="height: 80px;" align="center">${status.count }</td>
								-->
								<td><c:choose>
										<c:when test="${logScore.type == 0}">
											<font color="#FF5511">-<fmt:formatNumber value="${logScore.numer}" pattern="0" /></font>
										</c:when>
										<c:when test="${logScore.type == 1}">
											<font color="#00AA00">+<fmt:formatNumber value="${logScore.numer}" pattern="0" /></font>
										</c:when>
										<c:otherwise>
											${logScore.numer}
										</c:otherwise>
									</c:choose>
								</td>
								<td>${logScore.createTime}</td>
								<td>${logScore.bShop.name}</td>
							</tr>
						</c:forEach>
					</tbody>
				</table>
			</div>
		</div>
	</div>
	<div class="push"></div>
    </div>
	<c:import url="/jsp/commons/footer.jsp"></c:import>
  </body>
</html>